﻿@{
    ViewBag.Title = "ViewStoredData";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>View Stored Data</h2>
<p>If you can't see any data below, then @Html.ActionLink( "click here", "LoadEASToStorage") to import data.</p>

<table id="data-table" class="display">
    <thead>
        <tr>
            <th>
                id
            </th>
            <th>
                context
            </th>
            <th>
                value
            </th>
            <th></th>
        </tr>
        <tr>
            <th>
            </th>
            <th>
            </th>
            <th>
            </th>
            <th>
            </th>
        </tr>
    </thead>
    <tbody>
    </tbody>
    <tfoot>
    </tfoot>
</table>

@Html.ActionLink( "Back to home page", "Index", "Home", new { area = "" }, null ) | @Html.ActionLink("Back to admin home", "Index", "Home" )

<script type="text/javascript">
    var dataTable;
    $(document).ready(function () {
        dataTable = $('#data-table').dataTable({
            "sDom": 'Cl<"clear">rtip',
            "bJQueryUI": false,
            "sPaginationType": "full_numbers",
            "bProcessing": true,
            "bFilter": true,
            "bServerSide": true,
            "sAjaxSource": "@Url.Action( "ListEASData" )",
            "oLanguage": { "sSearch": "", "sLengthMenu": "_MENU_" },
            "fnServerData": function (url, data, callback) {
                $.ajax({
                    "url": url,
                    "data": data,
                    "success": callback,
                    "contentType": "application/x-www-form-urlencoded; charset=utf-8",
                    "dataType": "json",
                    "type": "POST",
                    "cache": false,
                    "error": function () {
                        alert("DataTables warning: JSON data from server failed to load or be parsed. " +
                        "This is most likely to be caused by a JSON formatting error.");
                    }
                });
            },
            "fnDrawCallback": function () {
                $(".editlink").attr('href', '#ineditform');
                $(".editlink").fancybox({ 'showCloseButton': true, 'hideOnOverlayClick': true, 
                       'onStart': function(array, index){
                            var t = $(array[index]);
                            var key = t.attr('key');
                            $('#ineditsavestatus').hide();
                            $('#ineditform').attr('dataTableId', 'data-table');
                            $.ajax({
                                "url": "@Url.Action("GetStringInfo")",
                                "data": { key: key },
                                "success": function(d){
                                    if( d.success ){
                                     $('#ineditkey').val(d.key);
                                     $('#ineditcontext').text(d.context);
                                     $('#ineditvalue').val(d.value);
                                    }
                                    else
                                        alert("Error getting details for " + key );
                                },
                                "contentType": "application/x-www-form-urlencoded; charset=utf-8",
                                "dataType": "json",
                                "type": "POST",
                                "cache": false,
                                "error": function () {
                                    alert("Error getting data for " + key );
                                }
                            });
                        } });
            },
            "aoColumns": [
                { "bSortable": false, "sWidth": "50px" },
                { "bSortable": false, "sClass": "left", "sWidth" : "70px" },
                { "bSortable": false, "sClass": "left" },
                { "bSortable": false, "sWidth": "50px" }
            ]
        }).columnFilter({ "sPlaceHolder": "head:after",
            aoColumns: [ 
            { type: "text" },
            { type: "text" },
            { type: "text" },
            null ]
        });
    });
</script>